<template>
  <div>
    <van-grid :border="false" :column-num="5">
      <template v-for="(item,index) in title.col1">
        <van-grid-item :key="index">
        <van-image :src="item.url" />
        <p>{{item.name}}</p>
      </van-grid-item>
      </template>
    </van-grid>
    <van-grid :border="false" :column-num="5">
      <template v-for="(item,index) in title.col2">
        <van-grid-item :key="index">
        <van-image :src="item.url" />
        <p>{{item.name}}</p>
      </van-grid-item>
      </template>
    </van-grid>
  </div>
</template>

<script>
export default {
  data() {
    return {
      title: {
        col1: [{name:"中餐",url:require("./images/first/icon1.png")}, 
        {name:"西餐",url:require("./images/first/icon2.png")}, 
        {name:"母婴",url:require("./images/first/icon3.png")},
        {name:"养生",url:require("./images/first/icon4.png")}, 
        {name:"素食",url:require("./images/first/icon5.png")}],
        col2: [{name:"面食",url:require("./images/first/icon6.png")}, 
        {name:"高汤",url:require("./images/first/icon7.png")}, 
        {name:"甜点",url:require("./images/first/icon8.png")},
        {name:"早餐",url:require("./images/first/icon9.png")}, 
        {name:"减脂",url:require("./images/first/icon10.png")}],
      },
    };
  },
};
</script>

<style>
</style>